window.App = Ember.Application.create({
    LOG_TRANSITIONS: true,
    LOG_ACTIVE_GENERATION: true,
    ready: function() {
        
    }
});
/********************************************************************************/
// Routing
/********************************************************************************/
App.Router.map(function() {
  this.resource('about');
  this.resource('shapes');
  this.resource('game');
  this.resource('finished');
  this.resource('question', { path: '/game/:question_id' });
  this.resource('guide');
});

// App.ApplicationRoute = Ember.Route.extend({
// });

App.ApplicationController = Ember.Controller.extend({
    needs: 'game',
    clean: function() {
        this.get('controllers').get('game').set('currentQuestionID', null);
    },
});

App.IndexRoute = Ember.Route.extend({
    redirect: function() {
        this.transitionTo('guide');
    }
});

App.GameRoute = Ember.Route.extend({
  model: function(params) {
    return App.Question.find();
  }
});

App.ShapesRoute = Ember.Route.extend({
  model: function(params) {
    return App.Shape3d.find();
  }
});

App.QuestionRoute = Ember.Route.extend({
    renderTemplate: function() {
        this.render('_shape');
        this.render('_answer');
        this.render('question');
    },

    model: function(arg) {
        var id = parseInt(arg.question_id, 10);
        var res = App.Question.find(id);
        if (!res) {
            alert('Did not find any question!');
        }
        return res;
    },
    serialize: function(question) {
        return { question_id: question.get('id') };
    },
    
    setupController: function(controller, model) {
        controller.set('model', model);
        controller.onSetupValidation();
    }
});

/********************************************************************************/
// Controllers
/********************************************************************************/
App.GameController = Ember.ArrayController.extend({
    sortProperties: ['id'],
    currentQuestionID: null,
    maxQuestionID: function() {
        return App.Question.find().get('length');
    }.property(),
    
    currentQuestion: function() {
        return App.Question.find(this.get('currentQuestionID'));;
    }.property('currentQuestionID'),

    forwardQuestions: function() {
        if (this.get('currentQuestionID') < this.get('maxQuestionID')) {
            return true;
        }
        else {
            return false;
        }
    }.property('currentQuestionID', 'maxQuestionID'),
    
    backwardQuestions: function() {
        if (this.get('currentQuestionID') > 1) {
            return true;
        }
        else {
            return false;
        }
    }.property('currentQuestionID'),
    
    submitAnswer: function() {
        if (this.get('forwardQuestions')) {
            this.set('currentQuestionID', this.get('currentQuestionID') + 1);
            this.transitionToRoute('question' , this.get('currentQuestion'));
        }
    },

    previousQuestion: function() {
        if (this.get('backwardQuestions')) {
            this.set('currentQuestionID', this.get('currentQuestionID') - 1);
            this.transitionToRoute('question' , this.get('currentQuestion'));
        }
    },
    
    startGame: function() {
        this.set('currentQuestionID', 1);
        this.transitionToRoute('question' , this.get('currentQuestion'));
    },
    
    progressBarStyle: function() {
        var progress = (this.get('currentQuestionID') / this.get('maxQuestionID')) * 100;
        var width = ("width: " + progress + "%;");
        var style = width + "float:right;";
        return style;
    }.property('currentQuestionID', 'maxQuestionID'),
    
    
    previousButtonClass: function() {
        if (this.get('backwardQuestions')) {
            return "next";
        }
        else {
            return "next disabled";
        }
    }.property('backwardQuestions'),
    
    nextButtonClass: function() {
        if (this.get('forwardQuestions')) {
            return "previous";
        }
        else {
            return "previous disabled";
        }
    }.property('forwardQuestions')
});

App.ShapesController = Ember.Controller.extend({
    
});

App.QuestionController = Ember.Controller.extend({
    needs: 'game',
    
    gameController: function() {
        return this.get('controllers').get('game');
    }.property('controllers', 'game'),
    
    selectAnswer: function(answerId) {
        var answer = App.Answer.find(answerId);
        var that = this;
        if (answer.get('isCorrect')) {
            if (this.get('gameController').get('forwardQuestions')) {
            $("#v").fadeIn(500, function(){setTimeout(function(){$("#v").fadeOut(500, function() { that.submitAnswer(); })}, 700)});
            }
            else {
            $("#v").fadeIn(500, function(){setTimeout(function(){$("#v").fadeOut(500, function() { that.transitionToRoute('finished'); })}, 700)});
            }
        }
        else {
                $("#x").fadeIn(500, function(){setTimeout(function(){$("#x").fadeOut(500);}, 700)});
        }
    },
    
    submitAnswer: function() {
        this.get('gameController').submitAnswer();
    },

    previousQuestion: function() {
        this.get('gameController').previousQuestion();
    },
    
    onSetupValidation: function() {
        if (this.get('model').get('id') != this.get('gameController').get('currentQuestionID')) {
            this.get('gameController').set('currentQuestionID', null);
        }
    },
    
});

App.ShapeSummaryController = Ember.Controller.extend({

});

/********************************************************************************/
// Models
/********************************************************************************/
App.Store = DS.Store.extend({
  adapter: 'DS.FixtureAdapter'
});

App.Question = DS.Model.extend({
    shape: DS.belongsTo('App.Shape3d'),
    answers: DS.hasMany('App.Answer'),
});

App.Shape3d = DS.Model.extend({
    text: DS.attr('string'),
    divId: DS.attr('string'),
    hebTitle: DS.attr('string'),
    hebDesc: DS.attr('string'),
});

App.Answer = DS.Model.extend({
    text: DS.attr('string'),
    imageUrl: DS.attr('string'),
    isCorrect: DS.attr('boolean')
});

/********************************************************************************/
// Views
/********************************************************************************/
App.QuestionShapeView = Ember.View.extend({
    didInsertElement: function() {
        console.log(this.kind);
        if (scene) {
            scene.remove();
        }
        if (renderer) {
            renderer.clear();
        }
        switch(this.kind) { 
            case "octahedron":
              console.log('Painting octahed');
              octahedron_init();
              octahedron_animate();
              break;
            case "cube":
              console.log('Painting cube');
              cube_init();
              cube_animate();
              break;
            case "pyramid":
              console.log('Painting pyramid');
              pyramid_init();
              pyramid_animate();
              break;
            case "prism":
              console.log('Painting prism');
              prism_init();
              prism_animate();
              break;
            case "cone":
              console.log('Painting cone');
              cone_init();
              cone_animate();
              break;
            case "cylinder":
              console.log('Painting cylinder');
              cylinder_init();
              cylinder_animate();  
              break;
            case "box":
              console.log('Painting box');
              box_init();
              box_animate();  
              break;
            case "tetrahedron":
              console.log('Painting tetrahedron');
              tetrahedron_init();
              tetrahedron_animate();  
              break;
            default:
        }
    },
    
    templateName: "_shape",
    tagName: "div",
    classNameBindings: ["defaultClass", "kind"],
    //defaultClass: "octahedron",
    kind: null,
    attributeBindings: ["style"],
    style: "margin-left: auto; margin-right:auto; margin-top: -50px; display:block;",
});


App.SummaryScrollView = Ember.View.extend({
    didInsertElement: function() {
            this.$().slimScroll({
               size: '7px',
                height: '275',
              
                opacity: '0.2',
            });
    },
    tagName: 'div',
    classNames: ["thumbnail"],
});

App.Shape3dView = Ember.View.extend({
    tagName: "img",
    shapeName: null,
    attributeBindings: ["src", "style"],
    src: function() {
        return ('images\\shapes\\' + this.get('shapeName') + '.png');
    }.property('shapeName'),
    style: function() {
        return "width: 60%; display: block; margin-left: auto; margin-right: auto;";
    }.property(),
});

App.ShapehebdescController = Ember.Controller.extend({
    collapseState: 'collapse',
    toggleCollapse: function() {
        if (this.get('collapseState') == 'collapse') {
            this.set('collapseState', 'in collapse');
        }
        else {
            this.set('collapseState', 'collapse');
        }
    },
    buttonText: function() {
        if (this.get('collapseState') == 'collapse') {
            return 'הצג תיאור';
        }
        else {
            return 'הסתר תיאור';
        }
    }.property('collapseState')
});

App.ShapehebdescView = Ember.View.extend({
    tagName: "div",
    attributeBindings: ["style"],
    classNameBindings: ["kind"],
    kind: "row-fluid summary",
    style: function() {
        return "font-weight:bold; text-align:center; direction:rtl;";
    }.property(),
    shapeName: null,
});





/*
App.AnswerButton = Ember.View.extend({
    templateName: "_abutton",
    tagName: "button",
    classNames: ["btn"],
    attributeBindings: ["type"],
    type: "button",
    click: function() {
	this.$().addClass("active");
    }
});
*/

App.AnswerView = Ember.View.extend({
    templateName: "_answer",
    classNames: ["img-rounded"],
    tagName: "img",
    attributeBindings: ["src"],
    src: null,
});

/********************************************************************************/
// Fixtures
/********************************************************************************/
App.Question.FIXTURES = [{
  id: 1,
  shape: 1,
  answers: [1, 2, 3, 4]
}, {
  id: 2,
  shape: 2,
  answers: [5, 6, 7, 8]
}, {
  id: 3,
  shape: 3,
  answers: [9, 10, 11, 12]
}, {
  id: 4,
  shape: 4,
  answers: [13, 14, 15, 16]
}, {
  id: 5,
  shape: 5,
  answers: [17, 18, 19, 20]
}, {
  id: 6,
  shape: 6,
  answers: [21, 22, 23, 24],
}, {
  id: 7,
  shape: 7,
  answers: [25, 26, 27, 28],
}, {
  id: 8,
  shape: 8,
  answers: [29, 30, 31, 32],
}];

App.Shape3d.FIXTURES = [{
  id: 1,
  text: 'Shape1',
  divId: 'octahedron',
  hebTitle: 'תמניון משוכלל',
  hebDesc: 'פאון קמור שכל פאותיו הן משולשים משוכללים חופפים, ומספר הפאות הנפגשות בקדקוד הוא 4, בכל הקדקודים.',

}, {
  id: 2,
  text: 'Shape2',
  divId: 'cube',
  hebTitle: 'קוביה',
  hebDesc: 'תיבה שכל פאותיה הן ריבועים. לקובייה 6 פאות שכולן ריבועים חופפים. קובייה היא גוף משוכלל.',
}, {
  id: 3,
  text: 'Shape3',
  divId: 'pyramid',
  hebTitle: 'פירמידה ריבועית',
  hebDesc: 'גוף הבנוי מריבוע (בסיס הפירמידה), נקודה מחוץ למישור המצולע (הנקראת ראש הפירמידה), ומכל המשולשים הנוצרים על ידי הנקודה וצלעות הריבוע (מעטפת הפירמידה).',
}, {
  id: 4,
  text: 'Shape4',
  divId: 'prism',
  hebTitle: 'מנסרה משושה ישרה',
  hebDesc: 'פאון בעל שני מצולעים משושים חופפים ו"מקבילים", הנקראים בסיסים. שאר פאותיו הן מלבנים המחברים בין הבסיסים והם מהווים את המעטפת.',
}, {
  id: 5,
  text: 'Shape5',
  divId: 'cone',
  hebTitle: 'חרוט',
  hebDesc: 'גוף המורכב מעיגול, נקודה הנמצאת מחוץ לעיגול, וכל הקטעים המחברים את הנקודה עם נקודות העיגול. לעיגול קוראים בסיס החרוט. לנקודה קוראים קדקוד החרוט.',
}, {
  id: 6,
  text: 'Shape6',
  divId: 'cylinder',
  hebTitle: 'גליל',
  hebDesc: 'גוף המורכב משני עיגולים חופפים המונחים במישורים מקבילים, ומכל הקטעים המחברים עיגולים אלה. לשני העיגולים קוראים בסיסי הגליל.',
}, {
  id: 7,
  text: 'Shape7',
  divId: 'box',
  hebTitle: 'תיבה',
  hebDesc: 'פאון שכל פאותיו הן מלבנים. התיבה היא מקרה פרטי של מנסרה ישרה שבה הבסיסים הם מלבנים.'
}, {
  id: 8,
  text: 'Shape8',
  divId: 'tetrahedron',
  hebTitle: 'ארבעון',
  hebDesc: 'פאון קמור שכל פאותיו הן משולשים משוכללים חופפים, ומספר הפאות הנפגשות בקדקוד שווה 3 בכל הקדקודים.'
}];

App.Answer.FIXTURES = [{
  id: 1,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\octahedron\\octehedron_0.png',
  isCorrect: true,
}, {
  id: 2,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\octahedron\\octehedron_1.png',
}, {
  id: 3,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\octahedron\\octehedron_2.png',
}, {
  id: 4,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\octahedron\\octehedron_3.png',
}, {
  id: 5,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\cylinder\\cylinder_3.png',
}, {
  id: 6,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\cube\\cube_1.png',
}, {
  id: 7,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\cube\\cube_0.png',
  isCorrect: true,
}, {
  id: 8,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\cube\\cube_3.png',
}, {
  id: 9,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\pyramid\\pyramid_2.png',
}, {
  id: 10,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\pyramid\\pyramid_1.png',
}, {
  id: 11,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\octahedron\\octehedron_3.png',
}, {
  id: 12,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\pyramid\\pyramid_0.png',
  isCorrect: true,
}, {
  id: 13,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\prism\\prism_3.png',
}, {
  id: 14,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\prism\\prism_1.png',
}, {
  id: 15,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\prism\\prism_0.png',
  isCorrect: true,
}, {
  id: 16,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\prism\\prism_2.png',
}, {
  id: 17,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\cone\\cone_0.png',
  isCorrect: true,
}, {
  id: 18,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\cone\\cone_1.png',
}, {
  id: 19,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\cone\\cone_2.png',
}, {
  id: 20,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\cone\\cone_3.png',
}, {
  id: 21,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\cylinder\\cylinder_1.png',
}, {
  id: 22,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\cylinder\\cylinder_0.png',
  isCorrect: true,
}, {
  id: 23,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\cylinder\\cylinder_2.png',
}, {
  id: 24,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\cylinder\\cylinder_3.png',
}, {
  id: 25,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\box\\box_1.png',
}, {
  id: 26,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\box\\box_2.png',
}, {
  id: 27,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\box\\box_0.png',
  isCorrect: true,
}, {
  id: 28,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\box\\box_3.png',
}, {
  id: 29,
  text: 'Answer1',
  imageUrl: '../shapes\\nets\\tetrahedron\\tetrahedron_0.png',
  isCorrect: true,
}, {
  id: 30,
  text: 'Answer2',
  imageUrl: '../shapes\\nets\\tetrahedron\\tetrahedron_1.png',
}, {
  id: 31,
  text: 'Answer3',
  imageUrl: '../shapes\\nets\\tetrahedron\\tetrahedron_2.png',
}, {
  id: 32,
  text: 'Answer4',
  imageUrl: '../shapes\\nets\\tetrahedron\\tetrahedron_3.png',
}];

// End of Models

